Skip to content

Updated all usage of AngleDoubleLeftIcon to RhUiDoubleCaretLeftIcon#12381

Open
tlabaj wants to merge 3 commits into
patternfly:mainfrom
tlabaj:angle_double_left_icon
Open

Updated all usage of AngleDoubleLeftIcon to RhUiDoubleCaretLeftIcon#12381
tlabaj wants to merge 3 commits into
patternfly:mainfrom
tlabaj:angle_double_left_icon

Conversation

@tlabaj
Copy link
Copy Markdown
Contributor

@tlabaj tlabaj commented Apr 27, 2026 •
edited by coderabbitai Bot
Loading

What: towards #12244

Summary

Replaces all usages of AngleDoubleLeftIcon with RhUiDoubleCaretLeftIcon (import path: @patternfly/react-icons/dist/esm/icons/rh-ui-double-caret-left-icon) across production code, examples, and demo apps for consistency with the Red Hat UI icon set.

Changes

  • Pagination: PaginationNavigation “first page” control now uses RhUiDoubleCaretLeftIcon.
  • Dual list selector: Deprecated DualListSelector and all non–code-connect examples (basic, tooltips, search, tree, complex actions, composable, drag-and-drop variants) plus related .md docs.
  • Drag and drop: DragDrop / DualListSelector example components and markdown.
  • Integration app: demo-app-ts DualListSelector demo screens updated to match.
  • Tests: Jest snapshots updated for components whose rendered SVG output changed (Pagination, PaginationNavigation, deprecated DualListSelector).

Summary by CodeRabbit

  • Style
    • Replaced the left-direction icon used for "Remove all" controls across DualListSelector components, demos, examples, and deprecated variants for a consistent look.
    • Updated the left-direction icon in pagination navigation and drag-and-drop samples to match.
    • Harmonizes visuals across documentation, demos, and runtime examples.

Closes #12398

@tlabaj tlabaj requested review from a team, nicolethoen and thatblindgeye and removed request for a team April 27, 2026 13:50
@coderabbitai
Copy link
Copy Markdown

coderabbitai Bot commented Apr 27, 2026 •
edited
Loading

Review Change Stack

Important

Review skipped

Review was skipped due to path filters

⛔ Files ignored due to path filters (3)
  • packages/react-core/src/components/Pagination/__tests__/Generated/__snapshots__/PaginationNavigation.test.tsx.snap is excluded by !**/*.snap, !**/generated/**
  • packages/react-core/src/components/Pagination/__tests__/__snapshots__/Pagination.test.tsx.snap is excluded by !**/*.snap
  • packages/react-core/src/deprecated/components/DualListSelector/__tests__/__snapshots__/DualListSelector.test.tsx.snap is excluded by !**/*.snap

CodeRabbit blocks several paths by default. You can override this behavior by explicitly including those paths in the path filters. For example, including **/dist/** will override the default block on the dist directory, by removing the pattern from both the lists.

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 2be6e8f8-c6a8-45a3-8576-76777f2c6742

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review

Walkthrough

This PR replaces all imports and usages of AngleDoubleLeftIcon with RhMicronsDoubleCaretLeftIcon across DualListSelector examples, deprecated DualListSelector files, DragDrop examples, PaginationNavigation, and related demo apps.

Changes

DualListSelector & related examples

Layer / File(s) Summary
Core DualListSelector files
packages/react-core/src/components/DualListSelector/examples/*, packages/react-core/src/deprecated/components/DualListSelector/*		 Replace AngleDoubleLeftIcon imports/usages with RhMicronsDoubleCaretLeftIcon in examples and deprecated DualListSelector component (updates import lines and "Remove all" control icon props).
DragDrop examples and docs
packages/react-drag-drop/src/components/DragDrop/examples/*		 Swap AngleDoubleLeftIcon → RhMicronsDoubleCaretLeftIcon in DragDrop example files and markdown demos that include DualListSelector usage.
Integration demo apps
packages/react-integration/demo-app-ts/src/components/demos/DualListSelectorDemo/*		 Update DualListSelector demo components to import and render RhMicronsDoubleCaretLeftIcon for the "Remove all" control.

Pagination

Layer / File(s) Summary
Pagination first-page icon
packages/react-core/src/components/Pagination/PaginationNavigation.tsx		 Replace AngleDoubleLeftIcon import with RhMicronsDoubleCaretLeftIcon and update the "first page" button's icon prop accordingly; no handler or logic changes.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related issues

Possibly related PRs

Suggested reviewers

  • phcox
  • thatblindgeye
  • mcoker
🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title accurately describes the primary change across the changeset: replacing AngleDoubleLeftIcon with RhUiDoubleCaretLeftIcon throughout multiple components and examples.
Linked Issues check ✅ Passed All three acceptance criteria from issue #12398 are met: AngleDoubleLeftIcon imports are replaced with RhUiDoubleCaretLeftIcon, no broken references are introduced, and test snapshots are updated accordingly.
Out of Scope Changes check ✅ Passed All changes are in-scope and directly related to icon replacement; no unrelated modifications to business logic, unrelated features, or extraneous code changes are present.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@tlabaj tlabaj requested review from a team, bekah-stephens and phcox and removed request for a team April 27, 2026 13:50
@patternfly-build
Copy link
Copy Markdown
Collaborator

patternfly-build commented Apr 27, 2026 •
edited
Loading

Preview: https://pf-react-pr-12381.surge.sh

A11y report: https://pf-react-pr-12381-a11y.surge.sh

nicolethoen
nicolethoen approved these changes Apr 27, 2026
View reviewed changes
Copy link
Copy Markdown
Contributor

@nicolethoen nicolethoen left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good - snapshots might need to be updated again

thatblindgeye
thatblindgeye approved these changes Apr 27, 2026
View reviewed changes
Copy link
Copy Markdown
Contributor

@thatblindgeye thatblindgeye left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we check if Cor

@tlabaj
Copy link
Copy Markdown
Contributor Author

tlabaj commented Apr 27, 2026

Can we check if Cor

@thatblindgeye Your message got cut off. What do we need to check?

@thatblindgeye
Copy link
Copy Markdown
Contributor

thatblindgeye commented Apr 28, 2026

lol whoops. Was gonna ask if we can check if Core has an issue to make the same update but then I remembered I had made an issue during my initial single caret updates there.

bekah-stephens
bekah-stephens reviewed Apr 28, 2026
View reviewed changes
Copy link
Copy Markdown

@bekah-stephens bekah-stephens left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm having issues pulling up the preview link, so I can't double check. I believe these should be using the micron version of the double caret -- @andrew-ronaldson is this true? I'm assuming most places where an icon has a micron version, we want to use that

@nicolethoen nicolethoen mentioned this pull request Apr 30, 2026
Open
3 tasks
@nicolethoen nicolethoen linked an issue Apr 30, 2026 that may be closed by this pull request
Replace AngleDoubleLeftIcon with RhUiDoubleCaretLeftIcon #12398
Open
3 tasks
@kmcfaul kmcfaul force-pushed the angle_double_left_icon branch from 89e7703 to 1437cee Compare May 26, 2026 14:46
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@bekah-stephens bekah-stephens bekah-stephens left review comments

@nicolethoen nicolethoen nicolethoen approved these changes

@thatblindgeye thatblindgeye thatblindgeye approved these changes

@phcox phcox Awaiting requested review from phcox phcox was automatically assigned from patternfly/design-reviewers

Assignees

No one assigned

Labels

Needs design review

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Replace AngleDoubleLeftIcon with RhUiDoubleCaretLeftIcon

6 participants

@tlabaj @patternfly-build @thatblindgeye @nicolethoen @bekah-stephens @kmcfaul